




import React from "react";
// import {useParams} from 'react-router-dom'
export default class Category extends React.Component{
    constructor(props){
        super(props)
        this.state={
            list:[]
        }
    }
    componentDidMount() {
        this.$axios.get('https://apipc-xiaotuxian-front.itheima.net/category?id=1011000').then(res=>{
            console.log(res.data.result);
            if (res.data.msg == '操作成功') {
                this.setState({
                    list:res.data.result
                })
            }
        })
    }
    render(){
        return (
            <div className="commonwidth top-category">
            <div className="sub-list">
              <h3>全部分类</h3>
              <ul>
              {/* {
                    this.state.list.map((i,index)=>{
                
                <li
                >
                  <a href="/#/">
                    <img 
                    src={i.picture}
                    />
                    <p>
                        { i.name }
                        </p>
                  </a>
  
                </li>
            })
        }   */}
              </ul>
            </div>
            <div className="ref-goods"
            //  v-for="(i, ind) in category.children" :key="ind"
             >
              <div className="head">
                <h3>
                    {/* - {{ i.name }} - */}
                    </h3>
                <p className="tag">温暖柔软，品质之选</p>
                <a href="/#/" className="xtx-more">
                  <span>查看全部</span>
                  <i className="iconfont icon-angle-right"></i>
                </a>
              </div>
              <div className="body">
                {/* <router-link
                  href="/#/"
                  class="goods-item"
                  v-for="(item, index) in i.goods"
                  :key="index"
                  :to="'/proguct/' + item.id"
                > */}
                  <img
                //    :src="item.picture" alt="" 
                   />
                  <p className="name ellipsis">
                      {/* {{ item.name }} */}
                      </p>
                  <p className="desc ellipsis">
                      {/* {{ item.desc }} */}
                      </p>
                  <p className="price">¥
                  {/* {{ item.price }} */}
                  </p>
                {/* </router-link> */}
              </div>
            </div>
          </div>


   
        )
                
            
            
            }
}